<template>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-search"
          size="mini"
          @click="handleSearch"
          >搜索</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleExport"
          >明细数据</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleExport2"
        >
          按日期统计-日统计
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleExport3"
        >
          按日期统计-周统计
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleExport4"
        >
          按日期统计-月统计
        </el-button>
      </el-col>

      <!-- 分页效果 -->
      <el-col :span="2.2" style="position: absolute; right: 0px; top: 0">
        <Page
          v-show="activeTab === 'one'"
          style="margin-right: 0px"
          :current="queryParams.pageNum"
          :page-size="queryParams.pageSize"
          :total="total"
          @on-change="pageChange"
          simple
        ></Page>
        <Page
          v-show="activeTab === 'two'"
          style="margin-right: 0px"
          :current="queryParams2.pageNum"
          :page-size="queryParams.pageSize"
          :total="total2"
          @on-change="pageChange2"
          simple
        ></Page>
        <Page
          v-show="activeTab === 'three'"
          style="margin-right: 0px"
          :current="queryParams3.pageNum"
          :page-size="queryParams.pageSize"
          :total="total3"
          @on-change="pageChange3"
          simple
        ></Page>
        <Page
          v-show="activeTab === 'four'"
          style="margin-right: 0px"
          :current="queryParams4.pageNum"
          :page-size="queryParams.pageSize"
          :total="total4"
          @on-change="pageChange4"
          simple
        ></Page>
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <el-tabs v-model="activeTab">
      <el-tab-pane label="明细数据" name="one">
        <el-table
          id="detailedData"
          highlight-current-row
          border
          stripe
          :height="tableH"
          v-loading="loading"
          :data="firstPartDetailedDataList"
          @row-dblclick="handleDetermine"
          :header-cell-style="{ 'text-align': 'center' }"
        >
          <el-table-column label="#" type="index" width="40" align="center" />
          <el-table-column
            label="机台"
            :show-overflow-tooltip="true"
            width="60"
            align="center"
            prop="sjlJtbh"
          />
          <el-table-column
            label="物料代码"
            :show-overflow-tooltip="true"
            width="110"
            align="center"
            prop="sjlWldm"
          />
          <el-table-column
            label="品名规格"
            :show-overflow-tooltip="true"
            width="250"
            align="center"
            prop="itmPmgg"
          />
          <el-table-column
            label="模具编号"
            :show-overflow-tooltip="true"
            width="180"
            align="center"
            prop="moeMjbh"
          />
          <el-table-column
            label="穴数"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="moeXs"
          />
          <el-table-column
            label="开始时间"
            :show-overflow-tooltip="true"
            align="center"
            prop="sjlKssj"
            width="120"
          />
          <el-table-column
            label="结束时间"
            :show-overflow-tooltip="true"
            align="center"
            prop="sjlJssj"
            width="120"
          />
          <el-table-column
            label="判定结果"
            :show-overflow-tooltip="true"
            width="80"
            align="center"
            prop="sjlPdjg"
          />
          <el-table-column
            label="审核结果"
            :show-overflow-tooltip="true"
            width="80"
            align="center"
            prop="sjlAudit"
          >
            <template #default="scope">
              <dict-tag :options="auditList" :value="scope.row.sjlAudit" />
            </template>
          </el-table-column>
          <el-table-column
            label="标准净重(KG)"
            :show-overflow-tooltip="true"
            width="110"
            align="center"
            prop="sjlJz"
          />
          <el-table-column
            label="cav1实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMz"
          />
          <el-table-column
            label="cav2实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavTwo"
          />
          <el-table-column
            label="cav3实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavThree"
          />
          <el-table-column
            label="cav4实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavFour"
          />
          <el-table-column
            label="cav5实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavFive"
          />
          <el-table-column
            label="cav6实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavSix"
          />
          <el-table-column
            label="cav7实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavSeven"
          />
          <el-table-column
            label="cav8实际净重(KG)"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlMzOneSavEight"
          />
          <el-table-column
            label="位置1cav1实际尺寸"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlSizeOneSavOne"
          />
          <el-table-column
            label="位置1cav2实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavTwo"
          />
          <el-table-column
            label="位置1cav3实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavThree"
          />
          <el-table-column
            label="位置1cav4实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavFour"
          />
          <el-table-column
            label="位置1cav5实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavFive"
          />
          <el-table-column
            label="位置1cav6实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavSix"
          />
          <el-table-column
            label="位置1cav7实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavSeven"
          />
          <el-table-column
            label="位置1cav8实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeOneSavEight"
          />
          <el-table-column
            label="位置2cav1实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavOne"
          />
          <el-table-column
            label="位置2cav2实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavTwo"
          />
          <el-table-column
            label="位置2cav3实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavThree"
          />
          <el-table-column
            label="位置2cav4实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavFour"
          />
          <el-table-column
            label="位置2cav5实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavFive"
          />
          <el-table-column
            label="位置2cav6实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavSix"
          />
          <el-table-column
            label="位置2cav7实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavSeven"
          />
          <el-table-column
            label="位置2cav8实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeTwoSavEight"
          />
          <el-table-column
            label="位置3cav1实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavOne"
          />
          <el-table-column
            label="位置3cav2实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavTwo"
          />
          <el-table-column
            label="位置3cav3实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavThree"
          />
          <el-table-column
            label="位置3cav4实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavFour"
          />
          <el-table-column
            label="位置3cav5实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavFive"
          />
          <el-table-column
            label="位置3cav6实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavSix"
          />
          <el-table-column
            label="位置3cav7实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavSeven"
          />
          <el-table-column
            label="位置3cav8实际尺寸"
            :show-overflow-tooltip="true"
            width="150"
            align="center"
            prop="sjlSizeThreeSavEight"
          />
          <el-table-column
            label="▲实际颜色"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlColor"
          />
          <el-table-column
            label="光泽度"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlGz"
          />
          <el-table-column
            label="黑点"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlMdflag"
          />
          <el-table-column
            label="气泡"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlQpflag"
          />
          <el-table-column
            label="缩水"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlSsflag"
          />
          <el-table-column
            label="变形"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlBxflag"
          />
          <el-table-column
            label="气纹"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlQwflag"
          />
          <el-table-column
            label="飞边、毛刺"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlFmflag"
          />
          <el-table-column
            label="划伤"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlHsflag"
          />
          <el-table-column
            label="熔接线"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlRjflag"
          />
          <el-table-column
            label="缺胶"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlQjflag"
          />
          <el-table-column
            label="分层"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlFcflag"
          />
          <el-table-column
            label="顶白"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlDbflag"
          />
          <el-table-column
            label="色差"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlScflag"
          />
          <el-table-column
            label="分色"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlFsflag"
          />
          <el-table-column
            label="杂色"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlZsflag"
          />
          <el-table-column
            label="冷料斑"
            :show-overflow-tooltip="true"
            width="80"
            align="center"
            prop="sjlLlflag"
          />
          <el-table-column
            label="表面光滑"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlBmghflag"
          />
          <el-table-column
            label="其他损伤"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlQtdesc"
          />
          <el-table-column
            label="用时(Min)"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlGs"
          />
          <el-table-column
            label="复核时间"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlChkrq"
          />
          <el-table-column
            label="复核用时(Min)"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlSjgs"
          />
          <el-table-column
            label="送检人员"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlJlrymc"
          />
          <el-table-column
            label="判定人员"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlPdrymc"
          />
          <el-table-column
            label="审核人员"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlAuditPeople"
          />
          <el-table-column
            label="审核时间"
            :show-overflow-tooltip="true"
            align="center"
            prop="sjlAuditTime"
            width="120"
          >
            <template #default="scope">
              <span>{{
                parseTime(scope.row.sjlAuditTime, "{y}-{m}-{d} {h}:{i}:{s} ")
              }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="复核人员"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlFhrymc"
          />
          <el-table-column
            label="不良原因"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlYymc"
          />
          <el-table-column
            label="备注"
            :show-overflow-tooltip="true"
            width="50"
            align="center"
            prop="sjlDesc"
          />
          <el-table-column
            label="复判备注"
            :show-overflow-tooltip="true"
            width="120"
            align="center"
            prop="sjlFpdesc"
          />
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="按日期统计-日统计" name="two">
        <el-table
          id="dailyStatistics"
          v-loading="loading"
          border
          stripe
          highlight-current-row
          :row-style="{ padding: '0px' }"
          :cell-style="{ padding: '0px 0' }"
          :header-row-style="{ padding: '2px 0' }"
          :header-cell-style="{ 'text-align': 'center', padding: '2px' }"
          :data="dayList"
          :height="tableH"
        >
          <el-table-column label="#" type="index" width="40" align="center" />
          <el-table-column
            label="日期"
            width="120"
            align="center"
            prop="sjlRq"
          />
          <el-table-column
            label="OK笔数"
            width="100"
            align="center"
            prop="sjlOk"
          />
          <el-table-column
            label="NG笔数"
            width="100"
            align="center"
            prop="sjlNg"
          />
          <el-table-column
            label="总笔数"
            width="100"
            align="center"
            prop="sjlTotal"
          />
          <el-table-column
            label="判退率%"
            width="100"
            align="center"
            prop="sjlPtl"
          />
          <el-table-column
            label="更改笔数"
            width="100"
            align="center"
            prop="sjlGgbs"
          />
          <el-table-column
            label="更改率%"
            width="100"
            align="center"
            prop="sjlGgl"
          />
          <el-table-column
            label="实际总用时(Min)"
            width="130"
            align="center"
            prop="sjlSjys"
          />
          <el-table-column
            label="复核总用时(Min)"
            width="130"
            align="center"
            prop="sjlFhys"
          />
          <el-table-column
            label="平均用时(Min)"
            width="130"
            align="center"
            prop="sjlPjys"
          />
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="按日期统计-周统计" name="three">
        <el-table
          id="weeklyStatistics"
          v-loading="loading"
          border
          stripe
          highlight-current-row
          :row-style="{ padding: '0px' }"
          :cell-style="{ padding: '0px 0' }"
          :header-row-style="{ padding: '2px 0' }"
          :header-cell-style="{ 'text-align': 'center', padding: '2px' }"
          :data="weekList"
          :height="tableH"
        >
          <el-table-column label="#" type="index" width="40" align="center" />
          <el-table-column
            label="日期"
            width="120"
            align="center"
            prop="sjlRq"
          />
          <el-table-column
            label="OK笔数"
            width="100"
            align="center"
            prop="sjlOk"
          />
          <el-table-column
            label="NG笔数"
            width="100"
            align="center"
            prop="sjlNg"
          />
          <el-table-column
            label="总笔数"
            width="100"
            align="center"
            prop="sjlTotal"
          />
          <el-table-column
            label="判退率%"
            width="100"
            align="center"
            prop="sjlPtl"
          />
          <el-table-column
            label="更改笔数"
            width="100"
            align="center"
            prop="sjlGgbs"
          />
          <el-table-column
            label="更改率%"
            width="100"
            align="center"
            prop="sjlGgl"
          />
          <el-table-column
            label="实际总用时(Min)"
            width="130"
            align="center"
            prop="sjlSjys"
          />
          <el-table-column
            label="复核总用时(Min)"
            width="130"
            align="center"
            prop="sjlFhys"
          />
          <el-table-column
            label="平均用时(Min)"
            width="130"
            align="center"
            prop="sjlPjys"
          />
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="按日期统计-月统计" name="four">
        <el-table
          id="monthlyStatistics"
          v-loading="loading"
          border
          stripe
          highlight-current-row
          :row-style="{ padding: '0px' }"
          :cell-style="{ padding: '0px 0' }"
          :header-row-style="{ padding: '2px 0' }"
          :header-cell-style="{ 'text-align': 'center', padding: '2px' }"
          :data="monthList"
          :height="tableH"
        >
          <el-table-column label="#" type="index" width="40" align="center" />
          <el-table-column
            label="日期"
            width="120"
            align="center"
            prop="sjlRq"
          />
          <el-table-column
            label="OK笔数"
            width="100"
            align="center"
            prop="sjlOk"
          />
          <el-table-column
            label="NG笔数"
            width="100"
            align="center"
            prop="sjlNg"
          />
          <el-table-column
            label="总笔数"
            width="100"
            align="center"
            prop="sjlTotal"
          />
          <el-table-column
            label="判退率%"
            width="100"
            align="center"
            prop="sjlPtl"
          />
          <el-table-column
            label="更改笔数"
            width="100"
            align="center"
            prop="sjlGgbs"
          />
          <el-table-column
            label="更改率%"
            width="100"
            align="center"
            prop="sjlGgl"
          />
          <el-table-column
            label="实际总用时(Min)"
            width="130"
            align="center"
            prop="sjlSjys"
          />
          <el-table-column
            label="复核总用时(Min)"
            width="130"
            align="center"
            prop="sjlFhys"
          />
          <el-table-column
            label="平均用时(Min)"
            width="130"
            align="center"
            prop="sjlPjys"
          />
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="图表分析" name="five">
        <!-- 图表统计 -->
      </el-tab-pane>
    </el-tabs>

    <!-- 查询对话框   -->
    <el-dialog
      :title="title"
      v-model="openSearch"
      :close-on-click-modal="false"
      draggable
      width="480px"
      append-to-body
    >
      <el-form
        :model="queryParams"
        ref="queryForm"
        :inline="true"
        v-show="showSearch"
        label-width="120px"
      >
        <el-col :span="24">
          <el-form-item label="生产日期">
            <el-date-picker
              v-model="dateRange"
              size="small"
              style="width: 215px"
              value-format="yyyy-MM-dd"
              type="daterange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="机台编号" prop="docWldm">
            <el-input
              v-model="queryParams.sjlJtbh"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
              placeholder="请输入机台编号"
            />
          </el-form-item>
        </el-col>
        <!--        <el-col :span="24">
          <el-form-item label="产品规格" prop="docMjbh">
            <el-input v-model="queryParams.itmPmgg" clearable size="small" @keyup.enter.native="handleQuery" />
          </el-form-item>
        </el-col>-->
        <el-col :span="24">
          <el-form-item label="综合查询" prop="docMjbh">
            <el-input
              v-model="queryParams.sjlWldm"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
              placeholder="请输入物料代码或客户编码"
            />
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            style="margin-top: 25px; display: flex; justify-content: flex-end"
          >
            <el-button @click="cancel">取消</el-button>
            <el-button type="primary" @click="handleQuery">确认</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-dialog>

    <!-- 判定品管首件确认作业 -->
    <el-dialog
      title="判定详情"
      v-model="determine"
      class="pdDialog"
      :close-on-click-modal="false"
      width="950px"
    >
      <el-form
        ref="pdForm"
        :model="firstPartDetailList"
        label-width="90px"
        inline
        size="mini"
        class="pdForm"
      >
        <table>
          <tr>
            <hd-form-item-td label="机台编号" size="mini">
              <el-input
                v-model="firstPartDetailList.sjlJtbh"
                readonly
                disabled
                class="readonlyInput"
                style="width: 60px"
              ></el-input>
            </hd-form-item-td>
            <hd-form-item-td label="发出人员" size="mini">
              <el-input
                v-model="firstPartDetailList.sjlJlrymc"
                readonly
                disabled
                class="readonlyInput"
                style="width: 80px"
              ></el-input>
            </hd-form-item-td>
            <hd-form-item-td label="发出时间" size="mini">
              <el-input
                v-model="firstPartDetailList.sjlKssj"
                readonly
                disabled
                class="readonlyInput"
                style="width: 150px"
              ></el-input>
            </hd-form-item-td>
          </tr>
          <tr>
            <hd-form-item-td label="制造单号" size="mini">
              <el-input
                v-model="firstPartDetailList.moeZzdh"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
            </hd-form-item-td>
            <hd-form-item-td colspan="2" label="入库物料" size="mini">
              <el-input
                v-model="firstPartDetailList.moeRkwl"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
              <el-input
                v-model="firstPartDetailList.moeRkpmgg"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
            </hd-form-item-td>
          </tr>
          <tr>
            <hd-form-item-td label="销售单号" size="mini">
              <el-input
                v-model="firstPartDetailList.moeSodh"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
            </hd-form-item-td>
            <hd-form-item-td label="物料代码" size="mini" colspan="2">
              <el-input
                v-model="firstPartDetailList.sjlWldm"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
              <el-input
                v-model="firstPartDetailList.itmPmgg"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
            </hd-form-item-td>
          </tr>
          <tr>
            <hd-form-item-td label="标准穴数" size="mini">
              <el-input
                v-model="firstPartDetailList.mjmXs"
                readonly
                disabled
                class="readonlyInput"
                style="width: 60px"
              ></el-input>
            </hd-form-item-td>

            <hd-form-item-td colspan="2" label="模具编号" size="mini">
              <el-input
                v-model="firstPartDetailList.moeMjbh"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
              <el-input
                v-model="firstPartDetailList.mjmMjmc"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
            </hd-form-item-td>
          </tr>
          <tr>
            <hd-form-item-td label="标准颜色" size="mini">
              <el-input
                disabled
                v-model="firstPartDetailList.itmStandardColor"
              ></el-input>
            </hd-form-item-td>
            <hd-form-item-td colspan="2" label="定额公差" size="mini">
              <el-input
                v-model="firstPartDetailList.gclRate"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
              %
              <el-input
                v-model="firstPartDetailList.gclGram"
                readonly
                disabled
                class="readonlyInput"
                style="width: 180px"
              ></el-input>
              kg
            </hd-form-item-td>
          </tr>
          <tr>
            <td colspan="3">
              <table style="font-size: 14px" class="tabCheck">
                <tr>
                  <th style="width: 52px" rowspan="2"></th>
                  <th style="width: 52px" rowspan="2">标准</th>
                  <th style="width: 52px" rowspan="2">上限值</th>
                  <th style="width: 52px" rowspan="2">下限值</th>
                  <th colspan="8">实测</th>
                </tr>
                <tr>
                  <th>
                    <span style="color: red; width: 2px; height: 2px">*</span>
                    cav1
                  </th>
                  <th>cav2</th>
                  <th>cav3</th>
                  <th>cav4</th>
                  <th>cav5</th>
                  <th>cav6</th>
                  <th>cav7</th>
                  <th>cav8</th>
                </tr>
                <tr>
                  <td>重量(g)</td>
                  <td>{{ firstPartDetailList.itmJz }}</td>
                  <td>
                    {{ firstPartDetailList.top }}
                  </td>
                  <td>
                    {{ firstPartDetailList.bottom }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMz * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavTwo * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavThree * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavFour * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavFive * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavSix * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavSeven * 1000 }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlMzOneSavEight * 1000 }}
                  </td>
                </tr>
                <tr>
                  <td>尺寸一</td>
                  <td>{{ firstPartDetailList.itmJccc1 }}</td>
                  <td>
                    {{ parseFloat(firstPartDetailList.itmJccc1S).toFixed(2) }}
                  </td>
                  <td>
                    {{ parseFloat(firstPartDetailList.itmJccc1X).toFixed(2) }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavOne }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavTwo }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavThree }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavFour }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavFive }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavSix }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavSeven }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeOneSavEight }}
                  </td>
                </tr>
                <tr>
                  <td>尺寸二</td>
                  <!--                  123-->
                  <td>{{ firstPartDetailList.itmJccc2 }}</td>
                  <td>
                    {{ parseFloat(firstPartDetailList.itmJccc2S).toFixed(2) }}
                  </td>
                  <td>
                    {{ parseFloat(firstPartDetailList.itmJccc2X).toFixed(2) }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavOne }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavTwo }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavThree }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavFour }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavFive }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavSix }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavSeven }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeTwoSavEight }}
                  </td>
                </tr>
                <tr>
                  <td>尺寸三</td>
                  <td>{{ firstPartDetailList.itmJccc3 }}</td>
                  <td>
                    {{ parseFloat(firstPartDetailList.itmJccc3S).toFixed(2) }}
                  </td>
                  <td>
                    {{ parseFloat(firstPartDetailList.itmJccc3X).toFixed(2) }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavOne }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavTwo }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavThree }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavFour }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavFive }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavSix }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavSeven }}
                  </td>
                  <td>
                    {{ firstPartDetailList.sjlSizeThreeSavEight }}
                  </td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <hd-form-item-td
              colspan="3"
              label="外观"
              size="mini"
              class="appearance"
            >
              {{ appearance }}
              {{ firstPartDetailList.sjlQtdesc }}
            </hd-form-item-td>
          </tr>
          <tr>
            <hd-form-item-td label="颜色" size="mini">
              {{ firstPartDetailList.sjlColor }}
            </hd-form-item-td>
            <hd-form-item-td label="标示不良" size="mini">
              {{ firstPartDetailList.sjlBsDesc }}
            </hd-form-item-td>
            <hd-form-item-td label="判定结果" size="mini">
              {{ firstPartDetailList.sjlPdjg }}
            </hd-form-item-td>
          </tr>
          <tr>
            <hd-form-item-td label="装配/性能不良" size="mini">
              {{ firstPartDetailList.sjlZxDesc }}
            </hd-form-item-td>
            <hd-form-item-td label="不良现象" size="mini">
              {{ firstPartDetailList.sjlYymc }}
            </hd-form-item-td>
            <hd-form-item-td colspan="3" label="备注" size="mini">
              {{ firstPartDetailList.sjlDesc }}
            </hd-form-item-td>
          </tr>
        </table>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import {
  exportFirstByGroupDay,
  exportFirstByGroupMonth,
  exportFirstByGroupWeek,
  exportFirstPartStaticsDetail,
  getFirstByGroupDay,
  getFirstByGroupMonth,
  getFirstByGroupWeek,
  listFirstPartConfirmationDeatil,
  listFirstPartDetailedData,
} from "@/api/quality/firstPart";

export default {
  name: "FirstPartStaticView",
  data() {
    return {
      // 遮罩层
      loading: true,
      // 导出遮罩层
      exportLoading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      determine: false,
      // 显示搜索条件
      showSearch: true,
      openSearch: false,
      // 默认选择的第几个表格
      activeTab: "one",
      // 总条数
      total: 0,
      total2: 0,
      total3: 0,
      total4: 0,
      mjmFileList: [],
      firstPartDetailList: {},
      appearance: [],
      tableH: document.body.clientHeight - 300,
      // 品检首件明细数据
      firstPartDetailedDataList: [],
      dayList: [],
      weekList: [],
      monthList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      bodyWidth: document.body.clientWidth,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: document.body.clientHeight > 900 ? 25 : 17,
        sjlJtbh: null,
        sjlWldm: null,
        itmPmgg: null,
      },
      queryParams2: {
        pageNum: 1,
      },
      queryParams3: {
        pageNum: 1,
      },
      queryParams4: {
        pageNum: 1,
      },
      // 表单参数
      form: {},
      // 开始时间和结束时间
      dateRange: [
        this.$moment().startOf("month").toDate(),
        new Date(new Date().getTime() + 1000 * 60 * 60 * 24 * 30),
      ],
      // 表单校验
      rules: {},
      auditList: [],
    };
  },
  created() {
    this.getDicts("first_part_state").then((response) => {
      this.auditList = response.data;
    });
    this.getList();
  },
  methods: {
    /** 查询品管确认作业列表 */
    getList() {
      this.loading = true;
      this.queryParams.params = {};
      if (null != this.dateRange && "" != this.dateRange) {
        this.queryParams.params["dateBegin"] = this.moment(
          this.dateRange[0]
        ).format("YYYY-MM-DD HH:mm:ss");
        this.queryParams.params["dateEnd"] =
          this.moment(this.dateRange[1]).format("YYYY-MM-DD") + " 23:59:59";
      }
      listFirstPartDetailedData(this.queryParams).then((res) => {
        this.firstPartDetailedDataList = res.rows;
        this.total = res.total;
        this.loading = false;
      });
      getFirstByGroupDay(this.queryParams).then((res) => {
        this.dayList = res.rows;
        this.total2 = res.total;
      });
      getFirstByGroupWeek(this.queryParams).then((res) => {
        this.weekList = res.rows;
        this.total3 = res.total;
      });
      getFirstByGroupMonth(this.queryParams).then((res) => {
        this.monthList = res.rows;
        this.total4 = res.total;
      });
    },
    /** 判定按钮操作 */
    handleDetermine(a, b, c) {
      console.log(a, b, c);
      listFirstPartConfirmationDeatil(a.sjlId).then((res) => {
        this.firstPartDetailList = res.data[0];
        if (
          this.firstPartDetailList.gclRate &&
          parseFloat(this.firstPartDetailList.gclRate) > 0
        ) {
          this.firstPartDetailList.top = parseFloat(
            this.firstPartDetailList.itmJz *
              (1 + this.firstPartDetailList.gclRate / 100) *
              1000
          ).toFixed(2);
          this.firstPartDetailList.bottom = parseFloat(
            this.firstPartDetailList.itmJz *
              (1 - this.firstPartDetailList.gclRate / 100) *
              1000
          ).toFixed(2);
        } else if (this.firstPartDetailList.gclGram) {
          this.firstPartDetailList.top = parseFloat(
            (parseFloat(this.firstPartDetailList.itmJz) +
              parseFloat(this.firstPartDetailList.gclGram)) *
              1000
          ).toFixed(2);
          this.firstPartDetailList.bottom = parseFloat(
            (parseFloat(this.firstPartDetailList.itmJz) -
              parseFloat(this.firstPartDetailList.gclGram)) *
              1000
          ).toFixed(2);
        }

        let c = [];
        this.firstPartDetailList.itmJz = this.firstPartDetailList.itmJz * 1000;
        //TODO 处理回显Flag
        if (this.firstPartDetailList.sjlMdflag) {
          c.push(this.firstPartDetailList.sjlMdflag);
        }
        if (this.firstPartDetailList.sjlQpflag) {
          c.push(this.firstPartDetailList.sjlQpflag);
        }
        if (this.firstPartDetailList.sjlSsflag) {
          c.push(this.firstPartDetailList.sjlSsflag);
        }
        if (this.firstPartDetailList.sjlBxflag) {
          c.push(this.firstPartDetailList.sjlBxflag);
        }
        if (this.firstPartDetailList.sjlQwflag) {
          c.push(this.firstPartDetailList.sjlQwflag);
        }
        if (this.firstPartDetailList.sjlFmflag) {
          c.push(this.firstPartDetailList.sjlFmflag);
        }
        if (this.firstPartDetailList.sjlHsflag) {
          c.push(this.firstPartDetailList.sjlHsflag);
        }
        if (this.firstPartDetailList.sjlRjflag) {
          c.push(this.firstPartDetailList.sjlRjflag);
        }
        if (this.firstPartDetailList.sjlQjflag) {
          c.push(this.firstPartDetailList.sjlQjflag);
        }
        if (this.firstPartDetailList.sjlFcflag) {
          c.push(this.firstPartDetailList.sjlFcflag);
        }
        if (this.firstPartDetailList.sjlDbflag) {
          c.push(this.firstPartDetailList.sjlDbflag);
        }
        if (this.firstPartDetailList.sjlScflag) {
          c.push(this.firstPartDetailList.sjlScflag);
        }
        if (this.firstPartDetailList.sjlFsflag) {
          c.push(this.firstPartDetailList.sjlFsflag);
        }
        if (this.firstPartDetailList.sjlZsflag) {
          c.push(this.firstPartDetailList.sjlZsflag);
        }
        if (this.firstPartDetailList.sjlLlflag) {
          c.push(this.firstPartDetailList.sjlLlflag);
        }
        if (this.firstPartDetailList.sjlBmghflag) {
          c.push(this.firstPartDetailList.sjlBmghflag);
        }
        if (this.firstPartDetailList.sjlQtflag) {
          c.push(this.firstPartDetailList.sjlQtflag);
        }
        this.appearance = c;
        this.determine = true;
      });
    },
    // 修改页取消按钮
    cancel() {
      this.open = false;
      this.openSearch = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        sjlJtbh: null,
        moeZzdh: null,
        moeSodh: null,
        itmCustwldm: null,
        sjlWldm: null,
        itmPmgg: null,
        moeMjbh: null,
        mjmMjmc: null,
        moeXs: null,
        itmSkzl: null,
        itmJz: null,
        itmMz: null,
        sjlJlrymc: null,
        sjlKssj: null,
        sjlId: null,
        sjlGlid: null,
      };
      this.resetForm("form");
    },
    /** 打开查询界面 */
    handleSearch() {
      this.title = "查询品管首件统计分析";
      this.openSearch = true;
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.getList();
      this.openSearch = false;
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 导出按钮操作 */
    handleExport(a, b) {
      const queryParams = this.queryParams;
      this.$confirm("是否确认导出所有首件数据项?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.exportLoading = true;
          return exportFirstPartStaticsDetail(queryParams);
        })
        .then((response) => {
          this.download(response.msg);
          this.exportLoading = false;
        })
        .catch(() => {});
    },
    handleExport2() {
      const queryParams = this.queryParams;
      this.$confirm("是否确认导出按日数据项?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.exportLoading = true;
          return exportFirstByGroupDay(queryParams);
        })
        .then((response) => {
          this.download(response.msg);
          this.exportLoading = false;
        })
        .catch(() => {});
    },
    handleExport3() {
      const queryParams = this.queryParams;
      this.$confirm("是否确认导出按周数据项?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.exportLoading = true;
          return exportFirstByGroupWeek(queryParams);
        })
        .then((response) => {
          this.download(response.msg);
          this.exportLoading = false;
        })
        .catch(() => {});
    },
    handleExport4() {
      const queryParams = this.queryParams;
      this.$confirm("是否确认导出按月数据项?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.exportLoading = true;
          return exportFirstByGroupMonth(queryParams);
        })
        .then((response) => {
          this.download(response.msg);
          this.exportLoading = false;
        })
        .catch(() => {});
    },
    /** 分页 **/
    pageChange(page) {
      this.queryParams.pageNum = page;
      this.loading = true;
      listFirstPartDetailedData(this.queryParams).then((res) => {
        this.firstPartDetailedDataList = res.rows;
        this.total = res.total;
        this.loading = false;
      });
    },
    pageChange2(page) {
      this.queryParams2 = JSON.parse(JSON.stringify(this.queryParams));
      this.queryParams2.pageNum = page;
      this.loading = true;
      getFirstByGroupDay(this.queryParams2).then((res) => {
        this.dayList = res.rows;
        this.total2 = res.total;
        this.loading = false;
      });
    },
    pageChange3(page) {
      this.queryParams3 = JSON.parse(JSON.stringify(this.queryParams));
      this.queryParams3.pageNum = page;
      this.loading = true;
      getFirstByGroupWeek(this.queryParams3).then((res) => {
        this.weekList = res.rows;
        this.total3 = res.total;
        this.loading = false;
      });
    },
    pageChange4(page) {
      this.queryParams4 = JSON.parse(JSON.stringify(this.queryParams));
      this.queryParams4.pageNum = page;
      this.loading = true;
      getFirstByGroupMonth(this.queryParams4).then((res) => {
        this.monthList = res.rows;
        this.total4 = res.total;
        this.loading = false;
      });
    },
  },
};
</script>

<style scoped lang="less">
.app-container {
  .mb8 {
  }
  #firstPartConfirmation {
  }
  .pdDialog {
    .pdForm {
      .tabCheck {
        table-layout: fixed;
        border-collapse: collapse;
        border: 1px solid black;
        width: 100%;
        td,
        th {
          border: 1px solid black;
          ::v-deep .el-input-number--mini {
            width: auto;
          }
        }
      }
      .pdTable {
        /deep/.ipt.el-input.el-input--mini {
          height: 18px;
          .el-input__inner {
            display: inline-block;
            height: 18px !important;
            border: none;
            padding: 0px !important;
          }
        }
      }
      //.el-table--enable-row-hover .el-table__body tr:hover > td{
      //  background-color: #FFFFFF;
      //}
    }
    .el-form.pdForm.el-form--inline {
      .el-form-item.el-form-item--mini {
        margin-bottom: 4px;
        font-size: 12px;
        /deep/.el-form-item__label {
          font-size: 12px;
        }
      }
    }
  }
}
</style>
